<template>
    <div class="index">
        <mainmenu />
        <carousel />
        <!-- <div>{{indexCarousel}}</div> -->
        <div class="main">
            <div class="container">
                <div class="newProducts">
                    <div class="NP-top">
                        <showproducts :goodsList="goodsList"/>
                    </div>
                    <div class="NP-bottom">
                        <div class="more">
                            <more />
                        </div>
                    </div>
                </div>
                <div class="classification">
                    <series :product="osmo"/>
                    <series :product="mavic"/>
                    <series :product="DJIFPV"/>
                    <series :product="Ronin"/>
                    <!-- <series :data= "" /> -->
                </div>
            </div>
        </div>
      
        
    </div>
</template>

<script>
import mainmenu from '../components/mainMenu.vue'
import showproducts from '../components/showProducts.vue'
import more from '../components/more.vue'
import series from '../components/series.vue'
import carousel from '../components/carousel.vue'
import {getGoods,getClassifyGoods,getCarousel} from '../assets/js/request'

export default {
    components: {
        mainmenu,
        showproducts,
        more,
        series,
        carousel,
    },
    data() {
        return{
            goodsList:[],
            osmo:[],
            mavic:[],
            DJIFPV:[],
            Ronin:[],
            CarouselList:[]
        }
    },
    computed: {
        // indexCarousel() {
        //     if(this.CarouselList.length>0) {
        //         this.CarouselList.filter((ele,index)=>{
        //             if(index<4) {
        //                 return this.CarouselList[index]
        //             }   
        //         })
        //     }
        // }
    },
    async created() {
        // 获取轮播图
        let carousel = await getCarousel("index");
        console.log(carousel);
        let a = carousel.filter((ele,index)=>{
            if(index<4) {
                return ele
            }
        })
        console.log(a);
        console.log(carousel);
        this.CarouselList = a;

        // 获取所有的商品
        let goods = await getGoods(100);
        console.log(goods);
        this.goodsList = goods;
        // 获取分类的商品
        // osmo
        let osmo = await getClassifyGoods(100,349);
        console.log(osmo);
        this.osmo = osmo.rows;

        let mavic = await getClassifyGoods(100,348);
        this.mavic = mavic.rows

        let DJIFPV = await getClassifyGoods(100,350);
        this.DJIFPV = DJIFPV.rows

        let Ronin = await getClassifyGoods(100,352);
        this.Ronin = Ronin.rows

    },
    computed: {
    },
    methods: {
    }
}
</script>
<style lang="scss" scoped>
@import "@/assets/scss/index.scss";
</style>
